{% extends 'base.html' %}

{% block styles %}
  {{ super() }}
  <link href="{{ url_for_static('static', filename='plugins/handsontable/handsontable.full.min.css') }}" rel="stylesheet">
  <link href="{{ url_for_static('static', filename='plugins/bootstrap-table/bootstrap-table.min.css') }}" rel="stylesheet">
  <link href="{{ url_for_static('static', filename='plugins/jquery.fancytree/skin-win8/ui.fancytree.min.css') }}" rel="stylesheet">
  <link href="{{ url_for_static('static', filename='css/report/report_detail.css') }}" rel="stylesheet">
{% endblock styles %}

{% block body_attribs %}
class="bg-gradient-grey"
{% endblock body_attribs %}

{% block app_content %}
<input type="text" class="form-control" id="input-dispatcher-id" placeholder="" value="{{ dispatcher.id }}" disabled style="display: none">
<div class="card shadow container-fluid mt-2 p-0">
  <div class="card-body p-0">
    <div class="container-fluid">
      <div class="div-container-report-summary pt-2">
        <div class="container-fluid row">
          <div id="echart-pie-result" style="width: 20%;height: 110%;"></div>
          <div>
            <div class="d-flex align-items-center">
              {% if dispatcher.element_type == ELEMENT_TYPE.PROJECT %}
              <span><b>项目名称: <a href="{{ url_for('module.module', project_id=dispatcher.element_id) }}">{{ report.name }}</a> {{ report.time }}</b></span>
              {% elif dispatcher.element_type == ELEMENT_TYPE.MODULE %}
              <span><b>模块名称: <a href="{{ url_for('scene.scene', module_id=dispatcher.element_id) }}">{{ report.name }}</a> {{ report.time }}</b></span>
              {% endif %}
              <span class="ml-2"><b>状态:</b></span>
              <span class="ml-1" id="report-dispatcher-status">{{ dispatcher.status }}</span>
              <div class="spinner-grow text-success align-self-center ml-1" id="report-dispatcher-spinner" role="status" style="width: 1em; height: 1em; display: {{ 'none' if dispatcher.status in ['已完成', '已停止'] }}">
                <span class="sr-only">Loading...</span>
              </div>
            </div>
            <div class="mt-1">
              <span class="badge badge-pill badge-primary">案例个数 <span id="report-case-total-count">{{ case_count }}</span></span>
              <span class="badge badge-pill badge-success">成功 <span id="report-case-success-count">{{ success_count }}</span></span>
              <span class="badge badge-pill badge-danger">失败 <span id="report-case-failure-count">{{ failure_count }}</span></span>
              <span class="badge badge-pill badge-error">错误 <span id="report-case-error-count">{{ error_count }}</span></span>
              <span class="badge badge-pill badge-secondary">跳过 <span id="report-case-skip-count">{{ skip_count }}</span></span>
            </div>
            <button class="btn btn-outline-primary btn-sm mt-2" type="button" id="btn-report-log">日志</button>
          </div>
        </div>
      </div>
      <div class="row div-container-report-detail">
    <div class="card container-fluid pre-scrollable p-0" id="report-tree-navigation">
      <div class="container-fluid" id="report-tree"></div>
    </div>
    <div class="card container-fluid pre-scrollable p-0" id="report-detail-data">
      <div class="d-flex justify-content-center align-items-center h-100" id="report-detail-data-load-spinner">
        <div class="spinner-border text-primary m-5" role="status">
          <span class="sr-only">加载中Loading...</span>
        </div>
      </div>
    </div>
  </div>
    </div>
  </div>
</div>
<div class="modal fade" id="modal-report-log" tabindex="-1" role="dialog">
  <div class="modal-dialog modal-dialog-centered modal-xl" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">运行日志</h5>
        <div class="ml-2 d-flex align-self-center">
          <span>状态:</span>
          <span class="ml-1" id="modal-report-log-dispatcher-status">{{ dispatcher.status }}</span>
          <div class="spinner-grow text-success align-self-center ml-1" id="modal-report-log-dispatcher-spinner" role="status" style="width: 1em; height: 1em; display: {{ 'none' if dispatcher.status in ['已完成', '已停止'] }}">
            <span class="sr-only">Loading...</span>
          </div>
        </div>
        <button type="button" class="close" data-dismiss="modal">
          <span>&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <div class="ace-report-log" id="div-ace-report-log">{{ dispatcher.log }}</div>
      </div>
      <div class="modal-footer">
      </div>
    </div>
  </div>
</div>
{% endblock %}


{% block scripts %}
  {{ super() }}
  <script src="{{ url_for_static('static', filename='plugins/handsontable/handsontable.full.min.js') }}"></script>
  <script src="{{ url_for_static('static', filename='plugins/handsontable/languages/all.js') }}"></script>
  <script src="{{ url_for_static('static', filename='plugins/jquery.fancytree/jquery.fancytree-all-deps.min.js') }}"></script>
  <script src="{{ url_for_static('static', filename='plugins/jquery.fancytree/modules/jquery.fancytree.filter.js') }}"></script>
  <script src="{{ url_for_static('static', filename='plugins/split.js/split.min.js') }}"></script>
  <script src="{{ url_for_static('static', filename='plugins/ace/ace.js') }}"></script>
  <script src="{{ url_for_static('static', filename='plugins/js-beautify/beautify.js') }}"></script>
  <script src="{{ url_for_static('static', filename='plugins/js-beautify/beautify-css.js') }}"></script>
  <script src="{{ url_for_static('static', filename='plugins/js-beautify/beautify-html.js') }}"></script>
  <script src="{{ url_for_static('static', filename='plugins/echarts/echarts.min.js') }}"></script>
  <script src="{{ url_for_static('static', filename='js/report/report_detail.js') }}"></script>
  <script>
    var dispatcher_id = {{ dispatcher.id }};
    var echart_pie_result_data = {{ echart_pie_result_data|safe }};
  </script>
{% endblock %}